<template>
    <IDrawer v-model="defaultValue" :loading="loading" :width="860" title="对接设置">
        <Form :model="data" :label-width="100" :rules="ruleValidate" ref="formCreate">
            <ListProduct :customer="data.customer_id" v-model="data.products"></ListProduct>
            <FormItem label="客户名称" prop="customer_id">
                <RemoteSelect url="common/select/customer" v-model="data.customer_id"></RemoteSelect>
            </FormItem>
            <Row>
                <Col :span="12">
                    <FormItem label="进境关别" prop="district">
                        <RemoteSelect url="common/select/customs" v-model="data.district"></RemoteSelect>
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="进境类型" prop="type">
                        <RemoteSelect type="type" v-model="data.type"></RemoteSelect>
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="运输方式" prop="transport">
                        <RemoteSelect type="transport" v-model="data.transport"></RemoteSelect>
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="包装种类" prop="packing_code">
                        <RemoteSelect type="packings" v-model="data.packing_code"></RemoteSelect>
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="货物总重" prop="weight">
                        <Input v-model="data.weight" number></Input>
                    </FormItem>
                </Col>
                <Col :span="12">
                    <FormItem label="货物件数" prop="piece">
                        <Input v-model="data.piece" number></Input>
                    </FormItem>
                </Col>
            </Row>
            <FormItem label="备注说明" prop="remark">
                <Input v-model="data.remark" :rows="4" type="textarea"></Input>
            </FormItem>
        </Form>
        <div slot="footer">
            <Button type="primary" icon="ios-add" @click="submit('formCreate')">提交</Button>
            <Button type="warning" icon="md-log-out" @click="defaultValue = false;">返回</Button>
        </div>
    </IDrawer>
</template>

<script>
    import IForm from "../../../components/content/form";
    import contentDrawer from "../../../mixins/contentDrawer";
    import IDrawer from "../../../components/content/drawer";
    import IData from "./data";
    import RemoteSelect from "../../../components/form/remoteSelect";
    import ListProduct from "./listProduct";

    export default {
        name: "update",
        mixins: [contentDrawer, IData],
        components: {ListProduct, RemoteSelect, IForm, IDrawer},
        data() {
            return {}
        },
        mounted(){
            this.getData();
        },
        methods: {
            getData(){
                this.loading = true;
                this.$http.get(`warehousing/index/${this.props.id}/edit`).then((res) => {
                    res.products = res.products.map((item) => {
                        return {
                            ...item,
                            code: item.product.code
                        }
                    })
                    this.data = res;
                }).finally(() => {
                    this.loading = false;
                });
            },
            submit(data) {
                this.validate(data).then(() => {
                    this.loading = true;
                    this.$http.put(`warehousing/index/${this.props.id}`, this.data).then(() => {
                        this.getData();
                    }).finally(() => {
                        this.loading = false;
                    });
                });
            }
        }
    }
</script>

<style scoped>

</style>
